<template>
  <slot name="footer" :data="webLanguages">
      <ul>
          <li v-for="(item, index) in webLanguages" :key="index">
              {{ item }}
          </li>
      </ul>
  </slot>
</template>

<script>
import { reactive, toRefs } from '@vue/reactivity'
export default {
    setup () {
        const state = reactive({
            webLanguages: [
                'HTML',
                'CSS',
                'JavaScript',
                'ES6',
                'ElementPlus',
                'Vue 3.0'
            ]
        })

        return {
            ...toRefs(state)
        }
    }
}
</script>

<style>

</style>